<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>template</title>
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet"
	href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<link
	href='https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css'
	rel='stylesheet' type='text/css'>
<style type="text/css">
@import
	url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css)
	;

a,b,body,br,button,dd,div,dl,dt,d,font,form,h1,h2,h3,h4,h5,h6,hr,input,i,label,legend,li,link,marquee,ol,optgroup,option,p,pre,q,select,small,span,strike,strong,table,tbody,td,textarea,tfoot,th,thead,tr,tt,u,ul,var
	{
	font-family: 'Nanum Barun Gothic', sans-serif;
}
</style>
<script type="text/javascript">
	function logout() {
		location.replace("/OffTheRecord/logout.action");
	}
	function searchCompany(){
		var f = document.searchForm;
		if(f.companyName.value==""){
			alert("회사명을 입력해주세요.");
			return f.companyName.focus();
		}
		f.submit();
	}
	function point(num, clickNode,messageId) {		
		$.ajax({
			type: "post",
			url: "/OffTheRecord/checkMessage.action",
			data: "messageId="+messageId,
			dataType:"json",
			
			success:function(data){
				$('#ch'+num).html(data.message.ch);
				$('#message').html(data.message.message);
			}
		});//ajax
		
		$("tr[id^='pointSub']").not("tr[id='pointSub" + num + "']").hide(); //	현재 선택한 node 외에 모든 td hide
		$("tr[id^='recruit_']").not("tr[id='recruit_" + num + "']")
				.removeClass("tr_hover"); //	현재 선택한 node 외에 모든 td hide
		$("tr[id^='recruit_']").not("tr[id='recruit_" + num + "']").hover(
				function(event) { //	mouseenter
					$(this).addClass("tr_hover");
				}, function(event) { //	mouseleave
					$(this).removeClass("tr_hover");
				});

		if (document.getElementById('pointSub' + num).style.display == "none") {
			document.getElementById('pointSub' + num).style.display = "";
			$(clickNode).parent().parent().addClass("tr_hover");

			$(clickNode).parent().parent().unbind("hover");
		} else {
			document.getElementById('pointSub' + num).style.display = "none";
			$(clickNode).parent().parent().removeClass("tr_hover");

			$(clickNode).parent().parent().hover(function(event) { //	mouseenter
				$(this).addClass("tr_hover");
			}, function(event) { //	mouseleave
				$(this).removeClass("tr_hover");
			});
		}
	}
	function report(d){
		
		$.ajax({
			type : "post",
			url : "/OffTheRecord/report.action",
			data : "id="+d,
			dataType:"json",
			success:function(data){
				alert("신고가 접수되었습니다.");
			}
		});
	}
	function replyMessage(receiver){
		window.open("/OffTheRecord/getMessageType.action?type=1&&receiver="+receiver, "","resizable=no,toolbar=no,width=400, height=330");
	}
</script>
<style type="text/css">
.link_tit {
	font-weight: bold;
	font-size: 14px;
	color: #444
}
</style>
</head>
<body>
	<script type="text/javascript">
	function openLogin(){
		window.open("/OffTheRecord/common/login.jsp", "","resizable=no,toolbar=no,width=400, height=300");
	}
</script>
	<div class="container">
		<div class="row">


			<!-- top -->
			<nav class="navbar navbar-inverse navbar-fixed-top"> <!-- Brand and toggle get grouped for better mobile display -->
			<div class="container-fluid">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle" data-toggle="collapse"
						data-target="#myNavbar">
						<span class="icon-bar"></span> <span class="icon-bar"></span> <span
							class="icon-bar"></span>
					</button>
					<a class="navbar-brand" href="/OffTheRecord/index/index.jsp">OFF
						the Record</a>
				</div>

				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse" id="myNavbar">
					<ul class="nav navbar-nav">

						<li class="dropdown"><a class="dropdown-toggle"
							data-toggle="dropdown" href="#">기업 검색<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li><a
									href="/OffTheRecord/getCompanyByIndustryName.action?industryName=건설&&pageNo=1">카테고리별
										검색</a></li>
								<li><a href="/OffTheRecord/customCompanyList.action">맞춤형
										검색</a></li>
							</ul></li>

						<li class="dropdown"><a class="dropdown-toggle"
							data-toggle="dropdown" href="#">멘토링<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li><a href="/OffTheRecord/mentor/mentor_intro.jsp">멘토링이란?</a></li>
								<li><a href="/OffTheRecord/mentor/mentor_apply.jsp">멘토신청</a></li>
								<li><a href="/OffTheRecord/getAllCompany.action?flag=4">멘토찾기</a></li>
							</ul></li>

						<li><a
							href="/OffTheRecord/getBoardListByPage.action?pageNo=1">자유게시판</a></li>
						<li><a
							href="/OffTheRecord/getNoticeListByPage.action?pageNo=1">공지사항</a></li>

					</ul>

					<c:choose>
						<c:when
							test="${sessionScope.adminVo==null && sessionScope.userVo == null}">
							<ul class="nav navbar-nav navbar-right">
								<li><a href="/OffTheRecord/user/register.jsp"><span
										class="glyphicon glyphicon-user"></span> 시작하기</a></li>
								<li><a href="" onclick="openLogin()"><span
										class="glyphicon glyphicon-log-in"></span> 로그인</a></li>
							</ul>
						</c:when>
						<c:when test="${sessionScope.userVo != null }">
							<ul class="nav navbar-nav navbar-right">
								<li><a href="/OffTheRecord/getAllMessage.action?mpageNo=1"><span
										class="glyphicon glyphicon-envelope"></span> <span
										class="badge" id="message">${userVo.message }</span></a></li>
								<li><a href="/OffTheRecord/userInfo.action"><span
										class="glyphicon glyphicon-user"></span>
										${sessionScope.userVo.userId } 님 로그인 중</a></li>
								<li><a href="#" onclick="logout(); return false"><span
										class="glyphicon glyphicon-log-out"></span> 로그아웃</a></li>
							</ul>
						</c:when>
					</c:choose>
					<ul class="nav navbar-nav navbar-center"
						style="margin-bottom: 20px;">
						<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
							<c:if test="${sessionScope.adminVo != null}">
								<!-- admin 일 경우 -->
								<button style="float: right;" type="button"
									class="btn btn-default"
									onclick="location.href='/OffTheRecord/admin/admin_info.jsp'">홈페이지
									관리하러 가기</button>
								<!-- admin 일 경우 -->
							</c:if>

						</div>
						<div class="col-lg-6 col-sm-6 col-md-6 col-lg-6">
							<li>
								<form class="form"
									action="/OffTheRecord/searchCompanyByName.action" method="post"
									role="form" name="searchForm">

									<div class="input-group">
										<input type="text" class="form-control"
											id="top_search_company" name="companyName"
											placeholder="회사명으로 검색해주세요."> <span
											class="input-group-btn">
											<button class="btn btn-default" type="button"
												onclick="searchCompany()">Go!</button>
										</span>
									</div>

								</form>
							</li>
						</div>
						<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
							<button type="button" class="btn btn-danger"
								onclick="location.href='/OffTheRecord/getAllList.action'">기업
								리뷰 작성하러가기</button>
						</div>
					</ul>
				</div>
			</div>
			</nav>
			<!--  -->


		</div>
		<!-- row -->
	</div>
	<!-- container -->

	<script
		src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
	<div class="container" style="margin: 60px;"></div>

	<div class="container">
		<div class="row">

			<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>

			<!--  -->
			<div class="col-xs-10 col-sm-10 col-md-10 col-lg-10">

				<div class="col-xs-3 col-sm-3 col-md-3 col-lg-3">
					<c:import url="../common/user_menu.jsp" />
				</div>


				<!--  -->
				<c:if test="${userVo != null && adminVo == null }">
					<div class="col-xs-9 col-sm-9 col-md-9 col-lg-9">

						<div class="user_message user_message-tabs">
							<ul id="myTab" class="nav nav-tabs">
								<li class="active"><a href="#receive" data-toggle="tab">받은
										쪽지함</a></li>
								<li><a href="#send" data-toggle="tab">보낸 쪽지함</a></li>
								<li><a href="#admin" data-toggle="tab">신고/건의 쪽지함</a></li>
							</ul>

							<div id="myTabContent" class="tab-content">
								<div class="tab-pane fade in active" id="receive">
									<div class="bs-example">
										<div class="table-responsive">
											<table class="table table-hover">

												<thead>
													<tr>
														<th>#</th>
														<th>쪽지 타입</th>
														<th>보낸 사람</th>
														<th>쪽지 내용</th>
														<th>확인 여부</th>
														<th>삭제</th>
													</tr>
												</thead>
												<c:forEach items="${mrlist.list }" var="message"
													varStatus="i">
													<tbody>
														<tr hover="Y" id="recruit_${i.count}" class="">
															<td>${i.count}</td>
															<td>${message.messageTypeVo.messageTypeNum }</td>
															<td id="messageReceiver">${message.messageReceiver }</td>
															<td><a href="#"
																onclick="point(${i.count} , this,${message.messageId }); return false;"
																class="link_tit">${message.messageContent }</a></td>
															<td id="ch${i.count}">${message.messageCheck }</td>
															<td><button class="btn btn-default btn-xs"
																	onclick="location.href='/OffTheRecord/deleteMessage.action?messageId=${message.messageId}'">삭제</button></td>
														</tr>
														<tr hover="Y" id="pointSub${i.count}"
															style="display: none;">
															<td colspan="6" class="detail"><h4 align="center">메세지
																	내용</h4>>> ${message.messageContent } <br> <br>
																<center>
																	<c:if
																		test="${message.messageTypeVo.messageTypeId == 1}">
																		<button onclick="report(${message.messageId})"
																			class="btn btn-default btn-xs">신고하기</button>&nbsp;&nbsp; 
																	<input class="btn btn-default btn-xs" type="button"
																			value="답장"
																			onclick="replyMessage('${message.messageReceiver }')">
																	</c:if>
																</center></td>
														</tr>
													</tbody>
												</c:forEach>
											</table>
										</div>
										<!-- /.table-responsive -->
										<hr>
										<p>

											<c:set var="pb" value="${ mrlist.pagingBean }" />

											<c:if test="${ pb.previousPageGroup }">
												<a
													href="/OffTheRecord/getAllMessage.action?mpageNo==${ pb.startPageOfPageGroup-1 }">
													<img src="/OffTheRecord/img/left_arrow_btn.gif">
												</a>
											</c:if>
										<div align="center">
											<c:forEach var="i" begin="${ pb.startPageOfPageGroup }"
												end="${ pb.endPageOfPageGroup }">
												<c:choose>
													<c:when test="${ pb.nowPage!=i }">
														<a href="/OffTheRecord/getAllMessage.action?mpageNo=${i}">${i}</a>
													</c:when>
													<c:otherwise>
													${i}
													</c:otherwise>
												</c:choose>
												&nbsp;
											</c:forEach>
										</div>

										<c:if test="${ pb.nextPageGroup }">
											<a
												href="/OffTheRecord/getAllMessage.action?mpageNo=${ pb.endPageOfPageGroup+1 }">
												<img src="/OffTheRecord/img/right_arrow_btn.gif">
											</a>
										</c:if>
										<br> <br>
									</div>
								</div>

								<div class="tab-pane fade" id="send">
									<div class="bs-example">
										<div class="table-responsive">
											<table class="table table-hover">
												<thead>
													<tr>
														<th>#</th>
														<th>쪽지 타입</th>
														<th>받는이</th>
														<th>쪽지 내용</th>
														<th>삭제</th>
													</tr>
												</thead>

												<c:forEach items="${mslist }" var="message1" varStatus="j">
													<tbody>
														<tr>
															<td>${j.count}</td>
															<td>${message1.messageTypeVo.messageTypeNum }</td>
															<td>${message1.messageSender }</td>
															<td>${message1.messageContent }</td>
															<td><button class="btn btn-default btn-xs">삭제</button></td>
														</tr>
													</tbody>
												</c:forEach>

											</table>

										</div>
										<!-- /.table-responsive -->
									</div>
								</div>
								<div class="tab-pane fade" id="admin">
									<div class="bs-example">
										<div class="table-responsive">
											<table class="table table-hover">
												<thead>
													<tr>
														<th>#</th>
														<th>쪽지 타입</th>
														<th>받는 사람</th>
														<th>쪽지 내용</th>
														<th>삭제</th>
													</tr>
												</thead>

												<c:forEach items="${maslist }" var="message1" varStatus="j">
													<tbody>
														<tr>
															<td>${j.count}</td>
															<c:if test="${message1.reportTarget == null }">
																<td>건의</td>
															</c:if>
															<c:if test="${message1.reportTarget != null }">
																<td>신고</td>
															</c:if>
															<td>${message1.adminVo.adminId }</td>
															<td>${message1.reportContent }</td>
															<td><button class="btn btn-default btn-xs">삭제</button></td>
														</tr>
													</tbody>
												</c:forEach>

											</table>

										</div>
										<!-- /.table-responsive -->
									</div>
								</div>
							</div>
						</div>
					</div>
				</c:if>
				<!--  -->
			</div>

			<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
		</div>
		<!-- row -->
	</div>
	<!-- container -->
	<script
		src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script
		src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
</body>
</html>